<template>
    <!-- 对话框表单 -->
    <el-dialog
        class="ba-operate-dialog"
        :close-on-click-modal="false"
        :model-value="baTable.form.operate ? true : false"
        @close="baTable.toggleForm"
    >
        <template #header>
            <div class="title" v-drag="['.ba-operate-dialog', '.el-dialog__header']" v-zoom="'.ba-operate-dialog'">
                {{ baTable.form.operate ? t(baTable.form.operate) : '' }}
            </div>
        </template>
        <el-scrollbar v-loading="baTable.form.loading" class="ba-table-form-scrollbar">
            <div
                class="ba-operate-form"
                :class="'ba-' + baTable.form.operate + '-form'"
                :style="'width: calc(100% - ' + baTable.form.labelWidth! / 2 + 'px)'"
            >
                <div class="btn-wrapper" v-if="baTable.form.items">
                    <div class="input-wrapper">
                        <template v-if="route.name == 'xRepairrecord/confirm'&&state.TZInputShow">
                            <label>业务编号</label>
                            <el-input v-model="baTable.form.items!.TZID" />
                            <el-button type="primary" :disabled="!baTable.form.items!.TZID" @click="handleConfirm">确认</el-button>
                        </template>
                    </div>
                    <div>
                        <el-button class="flow-btn" type="primary" @click="toApproval" v-if="baTable.form.items!.statuss&&baTable.form.items!.statuss !=='未发起'">{{t('Approval')}}</el-button>
                        <el-button class="flow-btn" type="primary" @click="toStock">配件库存查询</el-button>
                    </div>
                </div>
                <el-form
                    v-if="!baTable.form.loading"
                    ref="formRef"
                    :model="baTable.form.items"
                    label-position="right"
                    :label-width="'100px'"
                    :rules="rules"
                    :disabled="baTable.form.operate === 'view'||route.name != 'xRepairrecord/report'||baTable.form.items!.TJFLAG == '1'"
                >
                <div class="form1">
                    <FormItem :label="t('xRepairrecord.BIZNO')" type="string" v-model="baTable.form.items!.BIZNO" prop="BIZNO" :input-attr="{ placeholder: t('保存后自动生成'),disabled:true }" />
                    <FormItem :label="t('xRepairrecord.YARD')" 
                    v-model="baTable.form.items!.YARD" 
                    prop="YARD" 
                    type="remoteSelect"
                    :input-attr="{
                        pk: 'CORP',
                        field: 'CORP',
                        'remote-url': '/admin/corplib/index?type=2',
                    }" 
                    />
                    <FormItem :label="t('xRepairrecord.YARDOFFER')" type="number" prop="YARDOFFER" v-model.number="baTable.form.items!.YARDOFFER" :input-attr="{ step: '1', placeholder: t('Please input field', { field: t('xRepairrecord.YARDOFFER') }) }" />
                    <FormItem :label="t('xRepairrecord.OP')" type="string" v-model="baTable.form.items!.OP" prop="OP" :input-attr="{ placeholder: t('当前登录人'),disabled:true }" />
                    <FormItem 
                        :label="t('xRepairrecord.TCNO')" 
                        v-model="baTable.form.items!.TCNO" 
                        prop="TCNO" 
                        type="remoteSelect"
                        :input-attr="{
                            pk: 'TCNO',
                            field: 'TCNO',
                            'remote-url': '/admin/XPot/index?search[]=%7B%22field%22:%22STATUS%22,%22val%22:%22SYZ%22,%22operator%22:%22%3D%22%7D',
                        }" 
                    />
                    <FormItem 
                        :label="t('xRepairrecord.RPTYPE')" 
                        v-model="baTable.form.items!.RPTYPE" 
                        prop="RPTYPE" 
                        type="remoteSelect"
                        :input-attr="{
                            pk: 'code',
                            field: 'codename',
                            'remote-url': codelib  + 'now?where=repairtype'
                        }"
                    />
                    <FormItem :label="t('xRepairrecord.GJENDDATE')" type="datetime" v-model="baTable.form.items!.GJENDDATE" prop="GJENDDATE" :input-attr="{ placeholder: t('Please select field', { field: t('xRepairrecord.GJENDDATE') }) }" />
                    <FormItem :label="t('xRepairrecord.OPTIME')" type="datetime" v-model="baTable.form.items!.OPTIME" prop="OPTIME" :input-attr="{ placeholder: t('当前时间'),disabled:true }" />
                    <FormItem style="width:50%" :label="t('xRepairrecord.RPNOTE')" type="textarea" v-model="baTable.form.items!.RPNOTE" prop="RPNOTE" :input-attr="{ rows: 3, placeholder: t('Please input field', { field: t('xRepairrecord.RPNOTE') }) }" @keyup.enter.stop="" @keyup.ctrl.enter="baTable.onSubmit(formRef)" />
                    <FormItem style="width:50%" :label="t('xRepairrecord.OFFERDEMO')" type="textarea" v-model="baTable.form.items!.OFFERDEMO" prop="OFFERDEMO" :input-attr="{ rows: 3, placeholder: t('Please input field', { field: t('xRepairrecord.OFFERDEMO') }) }" @keyup.enter.stop="" @keyup.ctrl.enter="baTable.onSubmit(formRef)" />
                    <FormItem style="width:50%" :label="t('xRepairrecord.OFFERPATH')" type="file" v-model="baTable.form.items!.OFFERPATH" prop="OFFERPATH" :input-attr="{disabled:baTable.form.operate === 'view'||route.name != 'xRepairrecord/report'||baTable.form.items!.TJFLAG == '1'}" />
                    <FormItem :label="t('xContract.DEPT')"
                    style="width:50%" 
                    v-model="baTable.form.items!.DEPT" 
                    prop="DEPT" 
                    type="remoteSelect"
                    :input-attr="{
                        pk:'DEPTID',
                        field: 'DEPTNAME',
                        'remote-url':dEPARTMENT +'index',
                        placeholder: t('Click Select'),
                    }" />
                </div>
                </el-form>
                <el-divider/>
                <el-form
                    v-if="!baTable.form.loading"
                    ref="formRef2"
                    :model="baTable.form.items"
                    label-position="right"
                    :label-width="'100px'"
                    :rules="rules"
                    :disabled="baTable.form.operate === 'view'||route.name!=='xRepairrecord/check'||baTable.form.items!.statuss!=='未发起'"
                >
                <div class="form2">
                    <FormItem :label="t('xRepairrecord.MONEY')" type="number" prop="MONEY" v-model.number="baTable.form.items!.MONEY" :input-attr="{ step: '1', placeholder: t('Please input field', { field: t('xRepairrecord.MONEY') }) }" />
                    <FormItem :label="t('xRepairrecord.PF')" type="string" v-model="baTable.form.items!.PF" prop="PF" :input-attr="{ placeholder: '自动填入' ,disabled:true}" />
                    <FormItem :label="t('xRepairrecord.PFTIME')" type="datetime" v-model="baTable.form.items!.PFTIME" prop="PFTIME" :input-attr="{ placeholder: '自动填入',disabled:true }" />
                    <FormItem :label="t('xRepairrecord.YWY')" 
                    v-model="baTable.form.items!.YWY" 
                    prop="YWY" 
                    type="remoteSelect"
                    :input-attr="{
                        pk: 'nickname',
                        field: 'nickname',
                        'remote-url':authAdmin+'index',
                        placeholder: t('Click Select'),
                    }" />
                    <FormItem :label="t('xRepairrecord.ZWTYPE')" 
                    v-model="baTable.form.items!.ZWTYPE" 
                    prop="ZWTYPE" 
                    type="select" 
                    :data="{content: {'业务': '业务', '财务': '财务'}}"
                    :input-attr="{ placeholder: t('Please input field', { field: t('xRepairrecord.ZWTYPE') }) }" 
                    />
                    <FormItem :label="t('xRepairrecord.TZID')" type="string" v-model="baTable.form.items!.TZID" prop="TZID" :input-attr="{ placeholder: '',disabled:true}"/>
                    <FormItem style="width:100%" :label="t('xRepairrecord.PFDEMO')" type="textarea" v-model="baTable.form.items!.PFDEMO" prop="PFDEMO" :input-attr="{ rows: 3, placeholder: t('Please input field', { field: t('xRepairrecord.PFDEMO') }) }" />
                </div>
                </el-form>
                <el-divider />
                <el-form
                    v-if="!baTable.form.loading"
                    ref="formRef3"
                    :model="baTable.form.items"
                    label-position="right"
                    :label-width="'100px'"
                    :rules="rules"
                    :disabled="baTable.form.operate === 'view'||route.name!=='xRepairrecord/check'||!baTable.form.items!.TZID"
                >
                <div class="form3">
                    <FormItem :label="t('xRepairrecord.SJENDDATE')" type="datetime" v-model="baTable.form.items!.SJENDDATE" prop="SJENDDATE" :input-attr="{ placeholder: t('Please select field', { field: t('xRepairrecord.SJENDDATE') }) }" />
                    <FormItem :label="t('xRepairrecord.UPLOADER')" type="string" v-model="baTable.form.items!.UPLOADER" prop="UPLOADER" :input-attr="{ placeholder: '上传的用户',disabled:true }" />
                    <FormItem :label="t('xRepairrecord.UPLOADTIME')" type="datetime" v-model="baTable.form.items!.UPLOADTIME" prop="UPLOADTIME" :input-attr="{ placeholder: '上传的时间',disabled:true }" />
                    <!-- <FormItem :label="t('xRepairrecord.TJFLAG')" type="string" v-model="baTable.form.items!.TJFLAG" prop="TJFLAG" :input-attr="{ placeholder: t('Please input field', { field: t('xRepairrecord.TJFLAG') }) }" /> -->
                    <!-- <FormItem :label="t('xRepairrecord.DEPT')" type="string" v-model="baTable.form.items!.DEPT" prop="DEPT" :input-attr="{ placeholder: t('Please input field', { field: t('xRepairrecord.DEPT') }) }" /> -->
                    <FormItem style="width:100%" :label="t('xRepairrecord.FINISHFILE')" type="file" v-model="baTable.form.items!.FINISHFILE" prop="FINISHFILE" :input-attr="{disabled:baTable.form.operate === 'view'||route.name!=='xRepairrecord/check'||!baTable.form.items!.TZID}" />
                    <FormItem style="width:100%" :label="t('xRepairrecord.STATUS')" type="textarea" v-model="baTable.form.items!.STATUS" prop="STATUS" :input-attr="{ placeholder: t('Please input field', { field: t('xRepairrecord.STATUS') }) }" />
                </div>
                </el-form>
            </div>
        </el-scrollbar>
        <template #footer v-if="baTable.form.operate !== 'view'">
            <div :style="'width: calc(100% - ' + baTable.form.labelWidth! / 1.8 + 'px)'">
                <el-button @click="baTable.toggleForm('')">{{ t('Cancel') }}</el-button>
                <template v-if="route.name == 'xRepairrecord/report'&&baTable.form.items!.TJFLAG !== '1'">
                    <el-button v-blur :loading="baTable.form.submitLoading" @click="handleSave" type="primary">
                        {{ baTable.form.operateIds && baTable.form.operateIds.length > 1 ? t('Save and edit next item') : t('Save') }}
                    </el-button>
                    <el-button v-blur v-if="baTable.form.items!.BIZNO&&baTable.form.items!.TJFLAG!='1'" :loading="baTable.form.submitLoading" @click="handleSubmit" type="primary">
                        提交核价
                    </el-button>
                </template>

                <template v-if="route.name == 'xRepairrecord/check'">
                    <el-button v-if="baTable.form.items!.TZID" v-blur :loading="baTable.form.submitLoading" @click="handleCheckSave" type="primary">
                        {{ baTable.form.operateIds && baTable.form.operateIds.length > 1 ? t('Save and edit next item') : t('Save') }}
                    </el-button>
                    <el-button v-if="baTable.form.items!.statuss=='未发起'" v-blur :loading="baTable.form.submitLoading" @click="handleTj" type="primary">
                        发起审批流
                    </el-button>
                </template>
                <!-- <template v-if="route.name == 'xRepairrecord/approve'">
                    <el-button v-blur :loading="baTable.form.submitLoading" @click="toApproval" type="primary">
                        审批
                    </el-button>
                </template> -->
            </div>
        </template>
    </el-dialog>
</template>

<script setup lang="ts">
import { reactive, ref, inject, watchEffect ,watch } from 'vue'
import { useI18n } from 'vue-i18n'
import type baTableClass from '/@/utils/baTable'
import FormItem from '/@/components/formItem/index.vue'
import { ElForm, ElMessage, FormItemRule } from 'element-plus'
import { buildValidatorData } from '/@/utils/validate'
import { codelib,authAdmin,dEPARTMENT } from '/@/api/controllerUrls'
import { auth } from '/@/utils/common'
import createAxios from '/@/utils/axios'
import { useRoute, useRouter } from 'vue-router'
import { useApprovalInfo } from '/@/stores/approvalDialog'


const formRef = ref<InstanceType<typeof ElForm>>()
const baTable = inject('baTable') as baTableClass

const { t } = useI18n()

const rules: Partial<Record<string, FormItemRule[]>> = reactive({
    GJENDDATE: [buildValidatorData({name: 'date', message: t('Please enter the correct field', { field: t('xRepairrecord.GJENDDATE') })})],
    SJENDDATE: [buildValidatorData({name: 'date', message: t('Please enter the correct field', { field: t('xRepairrecord.SJENDDATE') })})],
    OPTIME: [buildValidatorData({name: 'date', message: t('Please enter the correct field', { field: t('xRepairrecord.OPTIME') })})],
    PFTIME: [buildValidatorData({name: 'date', message: t('Please enter the correct field', { field: t('xRepairrecord.PFTIME') })})],
    UPLOADTIME: [buildValidatorData({name: 'date', message: t('Please enter the correct field', { field: t('xRepairrecord.UPLOADTIME') })})],
})

const state = reactive({
    form1Disabled:false,
    form2Disabled:false,
    form3Disabled:false,
    TZInputShow:false
})

watch(()=>baTable.form.items!.BIZNO,(val:any)=>{
    if(baTable.form.items!.TZID){
        state.TZInputShow = false
    }else{
        state.TZInputShow = true
    }
})

const route = useRoute()
// console.log(route.name)

//维修报价保存
const handleSave = ()=>{
    baTable.onSubmit(formRef.value,(res:any)=>{
        if(!baTable.form.items!.BIZNO){
            baTable.form.items!.BIZNO = res.data
        }
    })
}
//维修报价提交核价
const handleSubmit = ()=>{
    createAxios({
        url:'/admin/XRepairrecord/evaluation?BIZNO='+baTable.form.items!.BIZNO,
        method:'get'
    }).then((res:any)=>{
        ElMessage({
            type:'success',
            message:'提交成功'
        })
        baTable.toggleForm()
        baTable.runAfter('onSubmit', { res })
    })
}


//维修核价里提交审批
const handleTj = ()=>{
    console.log(baTable.form.items)
    createAxios({
        url:'admin/XRepairrecord/tj',
        data:{
            ...baTable.form.items,
            bizno:baTable.form.items!.BIZNO
        },
        method:'post'
    }).then(()=>{
        ElMessage.success('提交成功')
        baTable.toggleForm()
        baTable.getIndex()
    })
}


// 核价的保存  业务结束后才可以保存
const handleCheckSave = ()=>{
    createAxios({
        url:'admin/XRepairrecord/edit_h',
        data:{
            ...baTable.form.items,
            bizno:baTable.form.items!.BIZNO
        },
        method:'post'
    }).then(()=>{
        ElMessage.success('保存成功')
        baTable.toggleForm()
        baTable.getIndex()
    })
}



//查看审批流
const approvalInfo = useApprovalInfo()

const toApproval = ()=> {
    approvalInfo.setData({
        bizno:baTable.form.items!.BIZNO,
        type:route.name == 'xRepairrecord/approve'?'approve':'view',
        flowname:'',
    })
    approvalInfo.setDialogShow(true)
}

//维修确认提交修改
const handleConfirm = ()=>{
    createAxios({
        url:'admin/XRepairrecord/edit_yw',
        data:{
            ...baTable.form.items,
            bizno:baTable.form.items!.BIZNO
        },
        method:'post'
    }).then(()=>{
        ElMessage.success('提交成功')
        baTable.toggleForm()
        baTable.getIndex()
    })
}


//配件库存查询跳转
const toStock = ()=>{
    window.open('/#/admin/xStockCheck')
}


</script>

<style scoped lang="scss">
.btn-wrapper{
    margin-bottom: 20px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    .input-wrapper{
        display: flex;
        align-items: center;
        label{
            white-space: nowrap;
            margin-left: 32px;
        }
        .el-input{
            margin:0 12px;
        }
    }

}
.form1{
    display: flex;
    flex-wrap: wrap;
    .el-form-item{
        width:25%
    }
}
.form2,.form3{
    display: flex;
    flex-wrap: wrap;
    .el-form-item{
        width:33.3%
    }
}
</style>
